define([
    'BreadCrumbsRenderer',
    'text!js/templates/galCounterTmpl.html',
    'text!js/templates/itemTmpl.html'

], function(BreadCrumbsRenderer,GalCounter,itemTmpl) {

    var initialize = function(perPageParam,currentPageParam,urlParams){
        BreadCrumbsRenderer.initialize();
        searchItems(perPageParam,currentPageParam,urlParams, GalCounter,itemTmpl);


    };
    return {
        initialize: initialize
    };
});

function searchItems(perPageParam, currentPageParam,urlParams, GalCounter,itemTmpl){


    $('ul.nav li:not(.divider-vertical)').removeClass();
    $('ul.nav li:not(.divider-vertical):nth(0)').toggleClass("backgroundTexture upShadow");

    IGalleryItem = Backbone.RelationalModel.extend({

    });
    IGallery = Backbone.RelationalModel.extend({

        relations:[
            {
                type:Backbone.HasMany,
                key:'items',
                relatedModel:'IGalleryItem'
            }
        ],
        defaults:{
            perPage:10,
            currentPage:1
        }
    });

    GalleryCounterView = Backbone.View.extend({

        render:function () {
            var compiled_template = _.template(GalCounter);

            var i = 0;
            var list="";
            if(parseInt(this.model.count)>1){
                if(this.model.currentPage!="0" ){
                    list += compiled_template({count:"<img src='/backbone/images/textures/left-arrow.png'/>", onPage:this.model.perPage, page:i, itemClass:'trans', liClass:'trans'});
                }

                for (i; i < (this.model.count / this.model.perPage); ++i) {
                    if(parseInt(this.model.currentPage)==i){
                        list += compiled_template({count:((i + 1).toString()), onPage:this.model.perPage, page:i, itemClass:'activePage', liClass:''});
                    }else{
                        list += compiled_template({count:((i + 1).toString()), onPage:this.model.perPage, page:i, itemClass:'disabled', liClass:''});
                    }
                }

                if(parseInt(this.model.currentPage)!=(i-1) ){
                    list=list.concat(compiled_template({count:"<img  src='/backbone/images/textures/right-arrow.png'/>", onPage:this.model.perPage, page:i - 1, itemClass:'trans',liClass:'trans'}));
                }
            }
            this.el.innerHTML =list;


            return this;
        }
    });

    GalleryItemView = Backbone.View.extend({

        render:function () {
            var compiled_template = _.template(itemTmpl);
            this.el.innerHTML = compiled_template(this.model.toJSON());
            return this;
        }
    });


    var IGalleryCollectionView = Backbone.View.extend({
        initialize:function () {
            var that = this;
            this._donutViews = [];

        },

        render:function () {
            var that = this;

            this.el.innerHTML="";


            this._donutViews = [];

            this.collection.each(function (donut) {
                that._donutViews.push(new GalleryItemView({
                    model:donut
                }));
            });
            var list = "";
            _(this._donutViews).each(function (dv) {
                list = list.concat(dv.render().el.innerHTML);
            });

            this.el.innerHTML+="<ul id='1'  class='thumbnails donuts'>" +list+"</ul>";

            $('#1 li').each(function (index) {
                $(this).delay(200 * index).fadeIn('fast');
            });

        }
    });
    var galleryCollectionView = new IGalleryCollectionView({
        el:$('#galleryContainer')[0]
    });

    gallery = new IGallery({
        perPage:2,
        currentPage:0
    });

    gallery.attributes.perPage = perPageParam;
    gallery.attributes.currentPage = currentPageParam;
    gallery.attributes.urlParams = urlParams;

    gallery.urlRoot = '/backbone/searchItems.php' + '?perPage=' + gallery.attributes.perPage + '&currentPage=' + gallery.attributes.currentPage+
        '&'+gallery.attributes.urlParams;
    gallery.fetch({
        error:function () {

        },
        success:function () { // model is ready now

            if(gallery.attributes.items.length==0){
                $('#galleryContainer')[0].innerHTML="";
            }else{
            galleryCollectionView.collection = gallery.attributes.items;
            galleryCollectionView.render();

            galleryCounter = new GalleryCounterView({
                    el:$('#galleryCounter')[0]
                }
            );
            galleryCounter.model = gallery.attributes;
            galleryCounter.render();
            }
        }
    });
}






